import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import './assets/scss/index.scss'
// highlight代码高亮插件
import hljs from 'highlight.js'
import 'highlight.js/styles/github-dark.css'
// 图片查看器
import ElImageViewer from '@/components/imageViewer/index.vue'


const app = createApp(App)

// highlight代码高亮插件
app.directive('highlight', (el)=> {
    let blockCode = el.querySelectorAll('pre code');
    blockCode.forEach((blockCode) => {
        hljs.highlightBlock(blockCode)
    })
})

ElImageViewer.install = function () {
    app.component(ElImageViewer.name, ElImageViewer)
}

app.use(store).use(router).use(ElementPlus).use(hljs).use(ElImageViewer).mount('#app')

